<template>
  <div class="home">
    <nav-bar ref="nav_bar"/>
    <h1>艺术团总览</h1>
    <el-table
        :data="table_data"
        stripe
        border
        style="width: 60%; margin: auto">
      <el-table-column
          prop="group"
          label="团名">
      </el-table-column>
      <el-table-column
          prop="num"
          label="人数">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
// @ is an alias to /src
import NavBar from "../components/nav-bar/nav_bar"
import axios from "axios";

export default {
  name: 'Home',
  components: {
    NavBar,
  },
  data() {
    return {
      table_data: [],
    }
  },
  methods: {
    increment() {
      this.$store.commit("increment")
    },
    reload_table_data() {
      axios.post(this.$store.state.post_site_dir.query_group_information,
          {
            key: this.$store.state.key
          })
          .then((res) => {
            if (res.data.error_code !== 0) {
              this.$message.error('获取艺术团信息出错，请重新登陆重试')
            } else {
              this.table_data = res.data.data
            }
          })
    }
  },
  mounted() {
    this.$refs.nav_bar.set_default_active_nav('-1')
  }
}
</script>

<style scoped>

</style>
